<!DOCTYPE html>
<html>

<head>
  <meta charset="utf-8">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="renderer" content="webkit">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">

  <script type="text/javascript" src="static/js/aes.min.js"></script>

  <script type="text/javascript" src="static/mapbox-gl/echarts.min.js"></script>
  <link rel="stylesheet" href="static/mapbox-gl/css/mapbox-gl.css">
  <link rel="stylesheet" href="static/mapbox-gl/css/mapboxgl.min.css">


  <script type="text/javascript" src="static/mapbox-gl/deck.gl.js"></script>
  <!-- <script type="text/javascript" src="static/mapbox-gl/mapbox-gl-enhance-sp.js"></script> -->
  <script type="text/javascript" src="static/mapbox-gl/EchartsLayer.js"></script>

  <!--  <script type="text/javascript" src="static/mapbox-gl/mapboxgl-es6.min.js"></script>-->
  <title><%=htmlWebpackPlugin.options.title %></title>
  <script src="static/config/app-config.js"></script>
  <script src="static/mapbox-gl/js/turf.min.js"></script>
  <script src="static/js/storage.js"></script>
  <script src="static/js/underscore-min.js"></script>
</head>
<style>
  body{
    min-width: 1000px;
    min-height: 800px;
  }
  body,
  div,
  dl,
  dt,
  dd,
  ul,
  ol,
  li,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  pre,
  code,
  form,
  fieldset,
  legend,
  input,
  textarea,
  p,
  blockquote,
  th,
  td {
    margin: 0;
    padding: 0
  }

  .chart_background {
    /* background:rgba(64,295,330,.7); */
  }

  .mapboxgl-popup {
    cursor: auto;
  }
  .layer-control .chart_item {
    display: flex!important;
  }
  .chart_item p {
    z-index: 999999;
    text-align: left;
    white-space: nowrap;
  }

  .chart_item:hover p {
    display: block;
  }

  .chart_fullscreen {
    position: fixed !important;
  }

  .mapboxgl-ctrl-top-right .mapboxgl-ctrl {
    margin: 30px 24px 0 0!important;
    float: right;
    z-index: 300;
  }
  .mapboxgl-ctrl-top-left, .mapboxgl-ctrl-top-right, .mapboxgl-ctrl-bottom-left, .mapboxgl-ctrl-bottom-right{
    z-index: 300;
  }
  .region-lable-map.mapboxgl-marker{
    cursor: pointer;
    z-index: 399;
  }
  .microdanlieyunsuanclass{
    width:600px!important;
  }
  .mapboxgl-control-container .mapboxgl-ctrl-group > button{
    background-color: rgba(12,71,100,1);
  }
  .mapboxgl-control-container .mapboxgl-ctrl-group > button + button{
    border-top: 1px solid #dddddd57;
  }
  .mapboxgl-control-container .mapboxgl-ctrl > button:hover{
    background-color:#0c4764;
    color: rgba(29,156,183,1);
  }
  .mapboxgl-control-container .mapboxgl-ctrl-group{
    background: none;
    border-radius: 2px;
    box-shadow: 0 0 0 0px rgba(0, 0, 0, 0.1);
  }
  .mapboxgl-ctrl-icon.mapboxgl-ctrl-compass > .mapboxgl-ctrl-compass-arrow{
    background: url(static/images/arrow.png) center no-repeat;
    background-size: auto 100%;
    background-image: url(static/images/arrow.png) !important;
  }
  .mapboxgl-ctrl-icon.mapboxgl-ctrl-zoom-out{
    background: url(static/images/zoomOut.png) center no-repeat;
    background-size: 55% auto;
    background-image: url(static/images/zoomOut.png)!important;
  }
  .mapboxgl-ctrl-icon.mapboxgl-ctrl-zoom-in{
    background: url(static/images/zoomIn.png) center no-repeat;
    background-size: 55% auto;
    background-image: url(static/images/zoomIn.png) !important;
  }
  #dialog #temlate #cancel{
    background:rgba(154,41,40,1)!important;
    border-radius:4px;
  }
  #dialog #temlate #save{
    background:rgba(13,100,145,1)!important;
    border-radius:4px;
  }
  #dialog #temlate #down{
    background:rgba(29,156,183,1)!important;
    border-radius:4px;
  }
  .screenshotLoadingClass .el-icon-loading{
    font-size: 5rem;
  }
  .screenshotLoadingClass .el-loading-text{
    font-size: 2rem!important;
  }
  .pocking-cus-click{
    cursor: pointer;
  }
  /*区划标签样式*/
  .region-lable-marker{
    cursor:hand;
    -webkit-border-radius: 1em!important;
    /* background: #ffffff36; */
  }
  .region-lable-marker:hover{
    -moz-box-shadow: 3px 3px 6px #3A3F5A;
    box-shadow: 3px 3px 6px #3A3F5A;
    cursor:hand;
    -webkit-border-radius: 1em!important;
    border: 1px solid #3A3F5A;
    background: #ffffff91;
    padding: 0 4px;
  }
  .region-lable-marker .tr{
    background-color: #5dd3be00;
  }
  .region-lable-marker .tr:hover{
    background-color: #5dd3be00;
    /* border:1px solid #666; */
    border-radius: 4px;
  }
  .region-lable-marker .tr .up{

  }
  .region-lable-marker .tr .regiontext .labelName{
    font-size: 14px;
    color: #05108c;
    white-space: nowrap;
    position: relative;
    font-weight: bold;
    text-shadow: 3px 0px 18px #c1c7bd;
  }
  .region-lable-marker .tr .down{
    width: 20px;
    height:20px;
  }
  .region-lable-marker:hover .tr .down{
    background: url(static/images/regionlable/down_hover.png) center no-repeat;
    background-size: 70% auto;
  }
  .region-lable-marker:hover .tr .up{
    background: url(static/images/regionlable/up_hover.png) center no-repeat;
    background-size: 70% auto;
  }
</style>

<body>
  <script src=<%=htmlWebpackPlugin.options.path %>/jquery.min.js> </script> <div id="app"></div>
  <script type="text/javascript" include="mapbox-gl-enhance,mapv" src="static/mapbox-gl/include-mapboxgl.js"></script>

  <!-- built files will be auto injected -->
</body>

</html>
